import {Component} from 'react';
import WithRouter from '../../router/WithRouter';
import RoomCss from './index.module.css'
class RoomItem extends Component{
    render(){
        return(
            <div onClick={()=>{
                this.props.router.navigate("/info/"+this.props.roomItem.room_id)
            }}>
            <div style={{ width: '320px', borderRadius: "5px", marginTop: '15px' }}>
                <div style={{ width: '100%', height: "180px", overflow: "hidden", borderRadius: "5px" }} className={RoomCss.box_img}>
                    <img src={this.props.roomItem.room_src} alt="" style={{ width: "100%", height: "180px", display: "block" }} className={RoomCss.room_img} />
                    <div className={RoomCss.tost}>
                        <div className={RoomCss.room_name}>
                            {this.props.roomItem.room_name}
                        </div>
                        <div>
                            <i className="fa fa-heart-o" aria-hidden="true"></i>
                         {(this.props.roomItem.online / 10000).toFixed(2)} 万
                        </div>
                    </div>
                </div>
                <div className={RoomCss.nickname}>
                    <i className="fa fa-television" aria-hidden="true"></i>
                    &nbsp; {this.props.roomItem.nickname}
                </div>
            </div>
        </div>
        )
    }
}
export default WithRouter(RoomItem);